<template>
  <div class="q-pa-md">
    <div style="color:blue">
      <!-- {{ refQuickFilter?.groupColumnStatement }}
      {{ refQuickFilter?.filterStatement }} -->
      <fieldset>
        <legend>quickItems</legend>
        {{ quickItems }}
      </fieldset>
      <fieldset>
        <legend>quickItemSummary</legend>
        {{ quickItemSummary }}
      </fieldset>
      <fieldset>
        <legend>quickItemSummaryRaw</legend>
        {{ quickItemSummaryRaw }}
      </fieldset>
    </div>
    <button @click="mockQuickItemSummary()">mock_QuickItemSummary</button>
    <button @click="mockQuickItemSummaryRaw()">mockQuickItemSummaryRaw</button>
    <t-quick-filter ref="refQuickFilter" :quickItems="quickItems" :filterFields='filterFields'
      :quickItemSummary="quickItemSummary" @init="onInitHandler" @filterChange="onFilterChangeHandler"></t-quick-filter>
    <button @click="msg=refQuickFilter.getFilterStatement()">getFilterStatement</button>
    <button @click="msg=refQuickFilter.getGroupColumnStatement()">getGroupColumnStatement</button>
    <button @click="msg=refQuickFilter.getQuickFilterStatement()">getQuickFilterStatement</button>
    <button @click="msg=refQuickFilter.getQuickFilter(ADVANCED_FILTER)">getQuickFilter(Object)</button>
    <button
      @click="msg = refQuickFilter.getQuickFilter(JSON.stringify(ADVANCED_FILTER))">getQuickFilter(String)</button>
    <button @click="msg = refQuickFilter.getQuickFilter('')">getQuickFilter("")</button>
    <pre>
      {{ msg }}
    </pre>
  </div>
</template>

<script>
  import { useQuasar } from '@teld/q-components';
  import { result, transform } from 'lodash';
  import { computed, ref } from 'vue';
import label from '../label';

  export default {
    setup() {
      const $q = useQuasar();

      const refQuickFilter = ref(null);
      const quickItems = ref({});

      const quickItemSummary = ref({})
      const mockQuickItemSummary = () => {
        quickItemSummary.value = transform(quickItems.value, (result, value, key) => {
          result[key] = transform(value, (summaryResult, mapItem, i) => {
            let summary = mockSummary();
            summaryResult[mapItem.value] = summary
          }, {})
        }, {})
      }

      const mockSummary = () => {
        let summary = Math.floor(Math.random() * 100);
        if (summary < 10) { summary = 0 }
        return summary;
      }


      const quickItemSummaryRaw = ref({})
      const mockQuickItemSummaryRaw = () => {

        quickItemSummaryRaw.value = [
          { Total: mockSummary(), State: "隐藏", State2: "隐藏" },
          { Total: mockSummary(), State: "隐藏", State2: "隐藏" },
          { Total: mockSummary(), State: "CN", State2: "CN" },
          { Total: mockSummary(), State: "CN", State2: "CN" },
          { Total: mockSummary(), State: "EN", State2: "EN" },
          { Total: mockSummary(), State: "EN", State2: "EN" },
        ]

        quickItemSummary.value = refQuickFilter.value.wrapSummary(quickItemSummaryRaw.value)
      }

      const onInitHandler = () => {
        quickItems.value = transform(filterFields.value, (result, f) => {
          if ('sdo' == f.valueType) {
            result[f.fieldAlias] = [{ label: "隐藏", value: "隐藏" }, { label: "中文", value: "CN" }, { label: "英文", value: "EN" }]
          }
        }, {})

        setTimeout(() => {
          mockQuickItemSummary();
        }, 2000);
      }

      const onFilterChangeHandler = () => { mockQuickItemSummaryRaw() }

      const ADVANCED_FILTER = {
        "ElementType": "Group",
        "Filters": [
          {
            "ElementType": "Filter",
            "Code": "SDO_DEP_BugState.Name",
            "Condition": "contains",
            "Value": "已关闭,已处理",
            "Name": "状态",
            "DataType": "string",
            "ValueName": "已关闭,已处理",
            "ValueType": 0
          },
          {
            "ElementType": "Relation",
            "Relation": "and"
          },
          {
            "ElementType": "Filter",
            "Code": "DO_DEP_ProjectBug.AssignTo",
            "Condition": "in",
            "Value": "a87e0bb9-15df-4cf9-8bf1-803a8ef71ea5,张辰",
            "Name": "指派给",
            "DataType": "string",
            "ValueName": "a87e0bb9-15df-4cf9-8bf1-803a8ef71ea5,张辰",
            "ValueType": 0
          }
        ]
      }

      const filterFields = ref([
        {
          "ID": "7a7842d3-1169-4c23-b7ac-b3856c6906c4",
          "tableAlias": "DO_do_projectbug_cj121801",
          "tableCode": "DO_do_projectbug_cj121801",
          "tableName": "do_projectbug_cj121801",
          "fieldCode": "State",
          "fieldName": "状态",
          "fieldAlias": "State",
          "displayType": "tab",
          "mockDataModel": "default",
          "isMultiple": true,
          "enableStatistics": true,
          "enableAllItem": true,
          "hideEmpty": true,
          "showTitle": false,
          "dataType": "Int",
          "valueType": "sdo",
          "filter_dataValue": "{\"DataBind\":\"DataQuery.GetSDO_statemachinetest_selectBasicList(DefaultInputFilter,PageIndex,PageSize,AdvancedFilter,AdvancedSort).List\",\"DataSource\":\"5030e87f-3250-4c3f-a839-bbf18630b57e\",\"ActionType\":3,\"RelatedCdoCode\":\"GetSDO_statemachinetest_selectBasicList\",\"ServicePara\":[{\"ID\":\"d149d54e-dce5-42ba-a845-e1b0526b63b1\",\"Code\":\"DefaultInputFilter\",\"Name\":\"模糊匹配参数\",\"DataType\":9,\"IsEmpty\":0,\"Value\":\"\"},{\"ID\":\"7462d708-6ee5-43cd-82ce-47cd37fb8bd8\",\"Code\":\"PageIndex\",\"Name\":\"页码\",\"DataType\":2,\"IsEmpty\":0,\"Value\":\"\"},{\"ID\":\"262e9b92-6a97-49f8-ae77-ae5c7d91737b\",\"Code\":\"PageSize\",\"Name\":\"分页大小\",\"DataType\":2,\"IsEmpty\":0,\"Value\":\"\"},{\"ID\":\"35fd7cf3-5fd7-4ac3-9e75-558222989dc1\",\"Code\":\"AdvancedFilter\",\"Name\":\"高级查询过滤条件\",\"DataType\":9,\"IsEmpty\":0,\"Value\":\"\"},{\"ID\":\"f47251eb-5371-4872-8350-f71a032e7d83\",\"Code\":\"AdvancedSort\",\"Name\":\"高级查询排序条件\",\"DataType\":9,\"IsEmpty\":0,\"Value\":\"\"}],\"isMultiple\":false,\"labelField\":\"Name\",\"valueField\":\"Code\",\"columns\":[{\"ID\":\"Code\",\"dataField\":\"Code\",\"caption\":\"编号\",\"dataType\":\"Int\"},{\"ID\":\"Name\",\"dataField\":\"Name\",\"caption\":\"名称\",\"dataType\":\"String\"}],\"ServiceParam\":[{\"ID\":\"d149d54e-dce5-42ba-a845-e1b0526b63b1\",\"Code\":\"DefaultInputFilter\",\"Name\":\"模糊匹配参数\",\"DataType\":9,\"IsEmpty\":0,\"Value\":\"\"},{\"ID\":\"7462d708-6ee5-43cd-82ce-47cd37fb8bd8\",\"Code\":\"PageIndex\",\"Name\":\"页码\",\"DataType\":2,\"IsEmpty\":0,\"Value\":\"\"},{\"ID\":\"262e9b92-6a97-49f8-ae77-ae5c7d91737b\",\"Code\":\"PageSize\",\"Name\":\"分页大小\",\"DataType\":2,\"IsEmpty\":0,\"Value\":\"\"},{\"ID\":\"35fd7cf3-5fd7-4ac3-9e75-558222989dc1\",\"Code\":\"AdvancedFilter\",\"Name\":\"高级查询过滤条件\",\"DataType\":9,\"IsEmpty\":0,\"Value\":\"\"},{\"ID\":\"f47251eb-5371-4872-8350-f71a032e7d83\",\"Code\":\"AdvancedSort\",\"Name\":\"高级查询排序条件\",\"DataType\":9,\"IsEmpty\":0,\"Value\":\"\"}]}"
        },
        {
          "ID": "7a7842d3-1169-4c23-b7ac-bool",
          "tableAlias": "DO_do_projectbug_cj121801",
          "tableCode": "DO_do_projectbug_cj121801",
          "tableName": "do_projectbug_cj121801",
          "fieldCode": "bool",
          "fieldName": "逻辑值",
          "fieldAlias": "bool",
          "displayType": "tab",
          "mockDataModel": "default",
          "isMultiple": false,
          "enableStatistics": false,
          "hideEmpty": false,
          "showTitle": false,
          "dataType": "Int",
          "valueType": "boolean",
          "filter_dataValue": ""
        },
        {
          "ID": "7a7842d3-1169-4c23-b7ac-bool",
          "tableAlias": "DO_do_projectbug_cj121801",
          "tableCode": "DO_do_projectbug_cj121801",
          "tableName": "do_projectbug_cj121801",
          "fieldCode": "date",
          "fieldName": "日期",
          "fieldAlias": "date",
          "displayType": "tab",
          "mockDataModel": "default",
          "isMultiple": false,
          "enableStatistics": false,
          "hideEmpty": false,
          "showTitle": false,
          "dataType": "Int",
          "valueType": "date",
          "filter_dataValue": ""
        },
        {
          "ID": "7a7842d3-1169-4c23-b7ac-b3856c6906c4",
          "tableAlias": "DO_do_projectbug_cj121801",
          "tableCode": "DO_do_projectbug_cj121801",
          "tableName": "do_projectbug_cj121801",
          "fieldCode": "State2",
          "fieldName": "状态2",
          "fieldAlias": "State2",
          "displayType": "tab",
          "mockDataModel": "default",
          "isMultiple": false,
          "enableStatistics": false,
          "hideEmpty": false,
          "showTitle": false,
          "dataType": "Int",
          "valueType": "sdo",
          "filter_dataValue": "{\"DataBind\":\"DataQuery.GetSDO_statemachinetest_selectBasicList(DefaultInputFilter,PageIndex,PageSize,AdvancedFilter,AdvancedSort).List\",\"DataSource\":\"5030e87f-3250-4c3f-a839-bbf18630b57e\",\"ActionType\":3,\"RelatedCdoCode\":\"GetSDO_statemachinetest_selectBasicList\",\"ServicePara\":[{\"ID\":\"d149d54e-dce5-42ba-a845-e1b0526b63b1\",\"Code\":\"DefaultInputFilter\",\"Name\":\"模糊匹配参数\",\"DataType\":9,\"IsEmpty\":0,\"Value\":\"\"},{\"ID\":\"7462d708-6ee5-43cd-82ce-47cd37fb8bd8\",\"Code\":\"PageIndex\",\"Name\":\"页码\",\"DataType\":2,\"IsEmpty\":0,\"Value\":\"\"},{\"ID\":\"262e9b92-6a97-49f8-ae77-ae5c7d91737b\",\"Code\":\"PageSize\",\"Name\":\"分页大小\",\"DataType\":2,\"IsEmpty\":0,\"Value\":\"\"},{\"ID\":\"35fd7cf3-5fd7-4ac3-9e75-558222989dc1\",\"Code\":\"AdvancedFilter\",\"Name\":\"高级查询过滤条件\",\"DataType\":9,\"IsEmpty\":0,\"Value\":\"\"},{\"ID\":\"f47251eb-5371-4872-8350-f71a032e7d83\",\"Code\":\"AdvancedSort\",\"Name\":\"高级查询排序条件\",\"DataType\":9,\"IsEmpty\":0,\"Value\":\"\"}],\"isMultiple\":false,\"labelField\":\"Name\",\"valueField\":\"Code\",\"columns\":[{\"ID\":\"Code\",\"dataField\":\"Code\",\"caption\":\"编号\",\"dataType\":\"Int\"},{\"ID\":\"Name\",\"dataField\":\"Name\",\"caption\":\"名称\",\"dataType\":\"String\"}],\"ServiceParam\":[{\"ID\":\"d149d54e-dce5-42ba-a845-e1b0526b63b1\",\"Code\":\"DefaultInputFilter\",\"Name\":\"模糊匹配参数\",\"DataType\":9,\"IsEmpty\":0,\"Value\":\"\"},{\"ID\":\"7462d708-6ee5-43cd-82ce-47cd37fb8bd8\",\"Code\":\"PageIndex\",\"Name\":\"页码\",\"DataType\":2,\"IsEmpty\":0,\"Value\":\"\"},{\"ID\":\"262e9b92-6a97-49f8-ae77-ae5c7d91737b\",\"Code\":\"PageSize\",\"Name\":\"分页大小\",\"DataType\":2,\"IsEmpty\":0,\"Value\":\"\"},{\"ID\":\"35fd7cf3-5fd7-4ac3-9e75-558222989dc1\",\"Code\":\"AdvancedFilter\",\"Name\":\"高级查询过滤条件\",\"DataType\":9,\"IsEmpty\":0,\"Value\":\"\"},{\"ID\":\"f47251eb-5371-4872-8350-f71a032e7d83\",\"Code\":\"AdvancedSort\",\"Name\":\"高级查询排序条件\",\"DataType\":9,\"IsEmpty\":0,\"Value\":\"\"}]}"
        }
      ])

      const msg = ref();

      return {
        ADVANCED_FILTER,
        msg,
        refQuickFilter,
        filterFields,
        onInitHandler,
        onFilterChangeHandler,
        quickItems,
        quickItemSummary,
        mockQuickItemSummary,
        quickItemSummaryRaw,
        mockQuickItemSummaryRaw,

      };
    },
  };
</script>
